// AJAX作用：
// * 异步的 JS 和 XML
// * 通过AJAX可以在浏览器中向服务器发送异步请求,最大的优势:无刷新获取数据(网页内容发生更改不刷新网页)


const btn = document.querySelectorAll('button');
const box = document.getElementById('box1');

// fetch函数发送请求
btn[0].addEventListener('click', function () {
    fetch('http://127.0.0.1:9000/?username=admin&password=admin',//url?url参数
        {
            //请求方法
            method: 'POST',
            //请求头
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            },
            //请求体参数
            body: 'name=张三&age=19'
        }).then(r => {
        console.log('成功！')
        // return r.text()
        return r.json()
    }).then(r => {
        box.innerHTML = JSON.stringify(r)
        console.log(r)
    }).catch(err => {
        console.log('失败！' + err)
    })
})